<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>东家帮-添加房源</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
	<meta name="format-detection" content="telephone=no">
	<meta name="renderer" content="webkit">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link rel="stylesheet" href="${base}/css/common.css"/>
	<link rel="stylesheet" href="${base}/css/index2.css"/>
	<base href="${base}/index/">
	<style type="text/css">
	</style>

</head>
<body>
<div class="house">
	<form action="${base}/index/houseSave" id="loginform" name="loginform" method="post">
	<input type="hidden"  name="id" id="id" value="${id?if_exists}" />
	<div class="data">
		<div class="line">
			<div class="label">公寓/小区:</div>
			<div class="text"><input type="text" id="name" name="name" placeholder="请输入公寓/小区名称" value="${name?if_exists}" maxlength="16"></div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">地理&nbsp;位置:</div>
			<div class="text">
					 <select name="province" id ="province" onchange="doProvAndCityRelation();"> 
                	  	<option value="江苏省">江苏省</option>
                	  </select><select name="city" id ="city" style="margin-left: 6px;" onchange="doCityAndVillageRelation();" />
                	  	<option value="苏州市">苏州市</option>
                	  </select> </div></div>
		<div class="line"><div class="label">&nbsp;</div><div class="text"><select name="village" id ="village" onchange="doVillageAndRoadRelation();">
                	  	<option value="姑苏区">姑苏区</option>
                	  </select>
                	  <select name="road" id ="road" style="margin-left: 1px;">
                	  	<option value="娄葑">娄葑</option>
                	  </select></div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">详细&nbsp;地址:</div>
			<div class="text"><input type="text" id="address" name="address"  placeholder="请输入公寓/小区详细地址" value="${address?if_exists}"></div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">住房&nbsp;面积:</div>
			<div class="text"><input type="text" id="area" name="area"  style="width: 30%;margin-right: 10%;text-align: right;" value="${area?if_exists}" />平方米</div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<p>房内设施</p>
			<input type="hidden"  name="equip" id="equip" value="${equip?if_exists}" />
			<div class="eq" style="width: 100%;padding-left: 6%;margin-top: 6px;">
			 <#list equipList as one>
			 <div class="e">
			 <input type="checkbox" name="e" id="e${one.id}"  value="${one.key}" style="width: 32px;padding: 0px;" >${one.key} 
			 </div>
			 </#list>
			 </div>
<!-- 			 <p><input id="more" placeholder="自定义 ,分割" style="width: 84%;border: 0px;border-bottom: 1px solid #f0f0f0;height: 32px;margin-top: 8px;margin-left: 2%;" ></p> -->
		</div>
	</div>
	
	<div class="data">
		<div class="line">
			<div class="label">布草情况:</div>
			<div class="text"><input type="radio"  name="linen"  style="width: 30px;" value="花色" checked="checked"/>花色 <input id="white" type="radio"  name="linen"  style="width: 30px;" value="白色" />白色</div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">1.5米床用:</div>
			<div class="text"><input type="number" id="five" name="five" style="width: 30%;margin-right: 10%;text-align: right;" value="${five?if_exists}" />套</div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">1.8米床用:</div>
			<div class="text"><input type="number" id="eight" name="eight"  style="width: 30%;margin-right: 10%;text-align: right;" value="${eight?if_exists}" />套</div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<div class="label">备注:</div>
			<div class="text"><input type="text" id="note" name="note"  style="width: 50%;margin-right: 10%;text-align: right;" value="${note?if_exists}" /></div>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<p>房产证</p>
			<input name="resid" type="hidden" id="residval" value="${resid?if_exists}"  >
			 <img id="resid" src="${resid?default(base+'/images/uploadimg.png')}" alt="点击上传房产证图片" class="pic" >
		</div>
	</div>
	<div class="data">
		<div class="line">
			<p>屋内照片</p>
			<input name="goods" type="hidden" id="goods" value="${goods?if_exists}"  >
			<input name="pic1" type="hidden" id="pic1val" value=""  />
			<input name="pic2" type="hidden" id="pic2val" value=""  />
			<input name="pic3" type="hidden" id="pic3val" value=""  />
			<input name="pic4" type="hidden" id="pic4val" value=""  />
			<input name="pic5" type="hidden" id="pic5val" value=""  />
			<input name="pic6" type="hidden" id="pic6val" value=""  />
			<input name="pic7" type="hidden" id="pic7val" value=""  />
			<input name="pic8" type="hidden" id="pic8val" value=""  />
			<input name="pic9" type="hidden" id="pic9val" value=""  />
			<#if exitGoodCnt gt 0>
				<#list goodsArray as one>
					<img id="pic${one_index+1}" src="${one?default(base+'/images/uploadimg.png')}" alt="点击上传屋内照片" class="pic goods" >
				</#list>
			</#if>
			 <#if goodCnt gt 0>
			 	<#list 1..goodCnt as one>
			 		<img id="pic${one_index}" src="${base+'/images/uploadimg.png'}" alt="点击上传屋内照片" class="pic goods" >
			 	</#list>
			 </#if>
		</div>
	</div>
	<div class="data">
		<div class="line">
			<input type="button" id="submit"  onclick="save();" value="${btn?if_exists}" class="btn" />
		</div>
	</div>
	</form>
	
</div>
</body>
<form action="${base}/util/uploadFile" method="post" name="uploadForm" enctype="multipart/form-data" id="uploadForm" class="hide" >
    <input name="pic" type="file" id="pic" class="hide"/>
</form>
<script type="text/javascript" src="${base}/js/common.js"></script>
<script src="${base}/js/jquery1.10.2.min.js" ></script>
<script src="${base}/js/jquery.form.js" ></script>
<script>
$("#province").val("${province?if_exists}").text("${province?if_exists}");
$("#city").val("${city?if_exists}").text("${city?if_exists}");
$("#village").val("${village?if_exists}").text("${village?if_exists}");
$("#road").val("${road?if_exists}").text("${road?if_exists}");



if ("白色"=="${linen?if_exists}"){
	$("#white").click();
}
<#if equip??>
	$("input[name='e']").each(function(){
		if('${equip?if_exists}'.indexOf($(this).val()) > -1){
			$(this).attr("checked","true");
		}  
    });
</#if>
equip
var currentPic;
var cityJson;
jQuery(function(){
    //load city.json
    $.getJSON(
        "${base}/city.json", 
        function(obj) {
            cityJson = obj;
            var sb = new StringBuffer("<option value=''>请选择省</option>");
            $.each(obj, function(i, val) {
                if(val.item_code == '0000'){
                    sb.append("<option value='"+val.item_name+"'>"+val.item_name+"</option>");
                }
            });
            $("#province").html(sb.toString());
        }
    );
	<#if province?exists && province!="">
    $("#province").append("<option value='${province?if_exists}' selected>${province?if_exists}</option>");
    </#if>
    <#if city?exists && city!="">
    $("#city").append("<option value='${city?if_exists}' selected>${city?if_exists}</option>");
    </#if>
    <#if village?exists && village!="">
    $("#village").append("<option value='${village?if_exists}' selected>${village?if_exists}</option>");
    </#if>
    <#if road?exists && road!="">
    $("#road").append("<option value='${road?if_exists}' selected>${road?if_exists}</option>");
    </#if>
    
	 // 文件上传
    $(".pic").click(function(){
        currentPic = $(this)
        $("#pic").click();
    });
    $("#pic").change(function (){
        var fileName = $("#pic").val()
        var options = {
            success:  showResponse,  //处理完成的回调函数
            resetForm: true,
            //dataType:  'json'
        };
        $("#uploadForm").ajaxSubmit(options);
    });
	<#if exitGoodCnt gt 0>
		<#list goodsArray as one>
		$("#pic${one_index+1}val").val("${one}");
		</#list>
	</#if>
});
function save(){
	// $("#equip").val()
	var name = $("#name").val();
	if(name.length==0){ 
		alert("请输入公寓/小区名称"); 
		$("#name").focus(); 
		return false; 
	}
	var address = $("#address").val();
	if(address.length==0){ 
		alert("请输入详细地址"); 
		$("#address").focus(); 
		return false; 
	}
	var area = $("#area").val();
	if(area.length==0){ 
		alert("请输入面积"); 
		$("#area").focus(); 
		return false; 
	}
	var resid =  $("#residval").val();
	if(resid.length==0){ 
		alert("请上传房产证"); 
		$("#residval").focus(); 
		return false; 
	}
	
	var equip = "" ;
	$("input[name='e']").each(function (){
		if($(this).is(':checked')){
			equip = equip + $(this).attr("value")+",";
		} 
	});
	$("#equip").val(equip);
	equip = equip +$("#more").val();
	var goods = "";
	for(var i = 1 ;i <10;i++){
		var picval = $("#pic"+i+"val").val() 
		if (picval){
			goods = goods +picval +","
		}
	}
	if(goods.length > 0 ){
		goods = goods.substring(0, goods.length-1);
	}
	$("#goods").val(goods);
	var options = {
           success:  showResponse2,  //处理完成的回调函数
           resetForm: true
       };
    $("#loginform").ajaxSubmit(options);
}
function showResponse2(responseText)  {
	alert(responseText);
	window.location.href="${base}/index/houseList";
}
function showResponse(responseText)  {
	$("#"+currentPic.attr("id")+"val").val(responseText);
	currentPic.attr("src", responseText)
}

// 省值变化时 处理市
function doProvAndCityRelation(){
    var city = $("#city");
    var village = $("#village");
    var road = $("#road");
    if(city.children().length > 1){
        city.empty();
    }
    if(village.children().length > 1){
        village.empty();
    }
    if($("#city").length == 0){
        city.append("<option value='-1'>市</option>");
    }
    if($("#village").length == 0){
        village.append("<option  value='-1'>区</option>");
    }
    if($("#road").length == 0){
    	road.append("<option  value='-1'>街道</option>");
    }
    var sb = new StringBuffer("<option value=''>请选择市</option>");
    $.each(cityJson, function(i, val) {
        if(val.item_code == $("#province").val()){
            sb.append("<option value='"+val.item_name+"'>"+val.item_name+"</option>");
        }
    });
    $("#city").html(sb.toString());
}
// 市值变化时 处理区/县
function doCityAndVillageRelation(){
    var cityVal = $("#city").val();
    var village = $("#village");
    var road = $("#road");
    if(village.children().length > 1){
        village.empty();
    }
    if($("#village").length == 0){
        village.append("<option value='-1'>区</option>");
    }
    if($("#road").length == 0){
    	road.append("<option  value='-1'>街道</option>");
    }
    var sb = new StringBuffer("<option value=''>请选择区</option>");
    $.each(cityJson, function(i, val) {

        if(val.item_code == cityVal){
            sb.append("<option value='"+val.item_name+"'>"+val.item_name+"</option>");
        }
        
    });
    $("#village").html(sb.toString());
    
}
function doVillageAndRoadRelation(){
	var cityVal = $("#city").val();
    var village = $("#village");
    var road = $("#road");
    
    if($("#road").length == 0){
        village.append("<option  value='-1'>街道</option>");
    }
    var sb = new StringBuffer("<option value=''>请选择街道</option>");
    $.each(cityJson, function(i, val) {

        if(val.item_code == (cityVal+"-"+village.val())){
            sb.append("<option value='"+val.item_name+"'>"+val.item_name+"</option>");
        }
        
    });
    $("#road").html(sb.toString());
    
	
}

function StringBuffer(str){    
    var arr = [];    
    str = str || "";
    var size = 0 ;  // 存放数组大小
    arr.push(str);
    // 追加字符串
    this.append = function(str1) {        
        arr.push(str1);        
        return this;    
    };
    // 返回字符串
    this.toString = function(){        
        return arr.join("");    
    };
    // 清空  
    this.clear = function(key){  
        size = 0 ;  
        arr = [] ;  
    }
    // 返回数组大小  
    this.size = function(){  
        return size ;  
    }
    // 返回数组  
    this.toArray = function(){  
        return buffer ;  
    }
    // 倒序返回字符串  
    this.doReverse = function(){  
        var str = buffer.join('') ;   
        str = str.split('');    
        return str.reverse().join('');  
    }
};
</script>
</html>
